<!doctype html>
<html>
<head>
	<meta charset="utf-8"/>
	<title>人力资源管理系统</title>
	
	<link rel="stylesheet" href="../css/layout.css" type="text/css" media="screen" />
	<link rel="stylesheet" href="../css/calendar.css" type="text/css" media="screen" />
	
	<!--[if lt IE 9]>
	<link rel="stylesheet" href="img/css/ie.css" type="text/css" media="screen" />
	<script src="img/js/html5.js"></script>
	<![endif]-->
	<script src="../js/jquery-1.5.2.min.js" type="text/javascript"></script>
	<script src="../api/api.js"></script>
	<script src="../js/schedule.js" type="text/javascript"></script>


	<script src="../js/hideshow.js" type="text/javascript"></script>
	<script src="../js/jquery.tablesorter.min.js" type="text/javascript"></script>
	<script type="text/javascript" src="../js/jquery.equalHeight.js"></script>
	<script type="text/javascript">
	$(document).ready(function() 
    	{ 
      	  $(".tablesorter").tablesorter(); 
   	 } 
	);
	$(document).ready(function() {

	//When page loads...
	$(".tab_content").hide(); //Hide all content
	$("ul.tabs li:first").addClass("active").show(); //Activate first tab
	$(".tab_content:first").show(); //Show first tab content

	//On Click Event
	$("ul.tabs li").click(function() {

		$("ul.tabs li").removeClass("active"); //Remove any "active" class
		$(this).addClass("active"); //Add "active" class to selected tab
		$(".tab_content").hide(); //Hide all tab content

		var activeTab = $(this).find("a").attr("href"); //Find the href attribute value to identify the active tab + content
		$(activeTab).fadeIn(); //Fade in the active ID content
		return false;
	});

});
    </script>
    <script type="text/javascript">
    $(function(){
        $('.column').equalHeight();
    });
</script>
  <script type="text/javascript">
        function preview1(file) {
            var img = new Image(), url = img.src = URL.createObjectURL(file)
            var $img = $(img)
            img.onload = function() {
                URL.revokeObjectURL(url)
                $('#preview').empty().append($img)
            }
        }
        function preview2(file) {
            var reader = new FileReader()
            reader.onload = function(e) {
                var $img = $('<img>').attr("src", e.target.result)
                $('#preview').empty().append($img)
            }
            reader.readAsDataURL(file)
        }
         
        $(function() {
            $('[type=file]').change(function(e) {
                var file = e.target.files[0]
                preview1(file)
            })
        })
    </script>
<script type="text/javascript">
	setInterval(function() {
		var now = (new Date()).toLocaleString();
		$('.current-time').text(now);
	}, 1000);
</script>


</head>


<body>

	<header id="header">
		<hgroup>
			<h1 class="site_title"><a href="index.html">人力资源管理系统</a></h1>
			<h2 class="section_title"></h2><div class="btn_view_site"><a href="login.html">注销</a></div>
		</hgroup>
	</header> <!-- end of header bar -->
	
	<section id="secondary_bar">
		<div class="user">
			<p id="staff"></p>
			<!-- <a class="logout_user" href="#" title="Logout">Logout</a> -->
		</div>
		<div class="breadcrumbs_container">
			<article class="breadcrumbs"><a href="index.html">系统管理中心</a> <div class="breadcrumb_divider"></div> <a class="current">人员信息录入</a></article>
			<div class="current-time"></div>
		</div>
	</section><!-- end of secondary bar -->
	
	<aside id="sidebar" class="column">
	<h3>人员管理</h3>
	<ul class="toggle">
		<li class="icn_new_article"><a href="lecadd.html">人员信息录入</a></li>
		<li class="icn_categories"><a href="leclist.html">人员信息查看</a></li>
		
	</ul>

		<h3>应聘信息管理</h3>
		<ul class="toggle">
			<li class="icn_new_article"><a href="hireinfo.html">应聘信息录入</a></li>
			<li class="icn_see_onlineUser"><a href="rencaiku.html">应聘信息查看</a></li>
			<li class="icn_categories"><a href="approval.html">应聘信息审核</a></li>
		</ul>

		<h3>公告管理</h3>
		<ul class="toggle">
			<li class="icn_new_article"><a href="notice_add.html">公告添加</a></li>

			<li class="icn_categories"><a href="notice_edit.html">公告编辑</a></li>

			<li class="icn_see_onlineUser"><a href="notice_check.html">公告查看</a></li>



		</ul>
	
	
	
	
	<footer>
		
	</footer>
</aside><!-- end of sidebar -->
	
	<section id="main" class="column">
		
			<article class="module width_full" id="myarticle">
				<header><h3>人员信息录入</h3></header>
					<div class="module_content">
							<fieldset style="width: 40%; float: left; margin-right: 18%;">
								<label>姓名</label>
								<input type="text" name="username" id="username" style="width: 85%;">
							</fieldset>
							<fieldset style="width: 40%; float: left;">
								<label>身份证号码</label>
								<input type="text" name="idcard" id="idcard" style="width: 85%;">
							</fieldset>
							<fieldset style="width: 40%; float: left; margin-right: 18%;">
								<label>密码</label>
								<input type="text" name="password" id="password" style="width: 85%;" >
							</fieldset>
                            <fieldset style="width:40%; float:left;" >                             
                                    <label>出生日期</label>
                                    <input type="text" id="birthday" class="birthday" style="width:85%;" onclick="showDatePicker()" />
                                <div style="position:relative; padding-top:30px; hover:#4493da">
                                    <div id="schedule-box" class="boxshaw" style=""></div>
                                </div>
                            </fieldset>
							<fieldset style="width: 20%; float:left; margin-right:38%; ">
								<label style="width: 30%">性别</label>
								 <input type="radio" name="sex"  value="1" checked  />男
								<input type="radio" name="sex" value="0"  />女
							</fieldset>
							
							<fieldset style="width:20%; float:left; " >
								<label style="width: 50%">是否管理员</label>
								<input type="checkbox" name="isadmin" id="isadmin"  style="margin-left:10px;"/>
							</fieldset>
							

							<fieldset style="width: 40%; float: left; margin-right:18%;">
								<label>年龄</label>
								<input type="text" name="age" id="age" style="width: 85%;  height:15px;" >
							</fieldset>
							<fieldset style="width:40%;float:left;" >
								<label>职位</label>
								<input type="text" name="position"  id="position" style="width:85%">
							</fieldset>
							<fieldset style="width: 40%; float: left; margin-right:18%;">
								<label>手机号</label>
								<input type="text" name="mobile" id="mobile" style="width: 85%;">
							</fieldset>
							<fieldset style="width: 40%; float: left; ">
								<label>邮箱</label>
								<input type="text" name="email" id="email" style="width: 85%;" >
							</fieldset>
							
							<fieldset style="width:100%; float:left;">
								<label>简介</label>
								<textarea rows="6" name="content" id="content" style="width:96%"></textarea>
							</fieldset>							
							</fieldset><div class="clear"></div>			
					</div>
				<footer>
					<div class="submit_link">
					
						<input type="submit" name="submit" id="save" value="提交" class="save_btn">
						<button class="reset" id="reset" >重置</button>
					</div>
					
				</footer>
			</article>
		<div class="spacer"></div>
	</section>
	<script type="text/javascript">
			function $getId(id) {
                return document.getElementById(id);
            }

             /**
             * 保存事件
             */

            let myarticle = $getId("myarticle"),
                save = $getId("save"),
                reset = $getId("reset"),
                username = $getId("username"),
                password = $getId("password"),
                sex = checkRadio("sex"),
                birthday = $getId("birthday"),
                isadmin = $getId("isadmin"),
                content = $getId("content"),
                position = $getId("position"),
                mobile = $getId("mobile"),
                email = $getId("email"),
                idcard = $getId("idcard"),
                age = $getId("age");

            $(document).mouseup(function(e){
                    var _con = $('birthday');   // 设置目标区域
                  if(!_con.is(e.target) && _con.has(e.target).length === 0){ // Mark 1
                        if ($getId("schedule-box").style.display == "block") {
                            $getId("schedule-box").style.display = "none";
                        } 
                  }
            });

           


            reset.onclick = function(){
            	username.value = "";
            	password.value = "";
            	birthday.value = "";
            	content.value = "";
            	isadmin.checked = false;//取消复选框的选择
            	position.value = "";
                mobile.value = "";
                email.value = "";
                idcard.value = "";
                age.value = "";
            	document.getElementsByName("sex")[0].checked = true;
            }

             save.onclick = function() {
                console.log(birthday.value);
                let data = {
                    username: username.value.trim(),
                    password: password.value,
                    sex: sex,
                    birthday: birthday.innerHTML ? birthday.innerHTML : setBirthday(),
                    isadmin: isadmin.checked ? 1 : 0,
                    content: content.value,
                    position: position.value,
                    mobile: mobile.value,
                    email: email.value,
                    idCard: idcard.value,
                    age: age.value
                };

                    myApi.user.addUser(data, function(err, result) {
                    if (err) {
                       alert(err);
                    } else {
                        //如果添加成功就将页面跳转到显示人员信息页面
                        alert("人员添加成功");
                        location.href = "leclist.html";
                    }

                });
               

            };


            function setBirthday() {
                let date = new Date();
                return date.getFullYear() + "-" + (date.getMonth() + 1) + "-" + date.getDate();
            }

             function checkRadio(radioname) {
                let rLists = document.getElementsByName(radioname),
                    radioV,
                    i;
                for (i = 0; i < rLists.length; i++) {
                    if (rLists[i].checked) {
                        radioV = rLists[i].value;
                        return radioV;
                    }
                }
                //如果没有选中，就返回第一个单选款的值
                if (i == rLists.length) {
                    radioV = rLists[0].value;
                }
                return radioV;
            }


			//显示日期
            function showDatePicker() {
                if ($getId("schedule-box").style.display == "block") {
                    $getId("schedule-box").style.display = "none";
                } else if ($getId("schedule-box").style.display == "none" || !$getId("schedule-box").style.display) {
                    $getId("schedule-box").style.display = "block";
                }
            }
			// 日期插件
            var mySchedule = new Schedule({
                el: '#schedule-box',
                //date: '2018-9-20',
                clickCb: function(y, m, d) {
                    birthday.value = y + '-' + m + '-' + d
                },
                nextMonthCb: function(y, m, d) {
                    birthday.value = y + '-' + m + '-' + d
                },
                nextYeayCb: function(y, m, d) {
                    birthday.value = y + '-' + m + '-' + d
                },
                prevMonthCb: function(y, m, d) {
                    birthday.value = y + '-' + m + '-' + d
                },
                prevYearCb: function(y, m, d) {
                    birthday.value = y + '-' + m + '-' + d
                }
            });
	</script>

	<script>

        let staff = document.getElementById("staff");

        $(staff).text(localStorage.getItem("username"));

//        document.getElementById("username").value = localStorage.getItem("username");
//        document.getElementById("idcard").value = localStorage.getItem("identity");
//        document.getElementById("password").value = localStorage.getItem("password");
//        document.getElementById("birthday").value = localStorage.getItem("birthday");
//        document.getElementById("age").value = localStorage.getItem("age");
//        document.getElementById("position").value = localStorage.getItem("position");
//        document.getElementById("mobile").value = localStorage.getItem("tel");
//        document.getElementById("username").value = localStorage.getItem("username");
//        document.getElementById("username").value = localStorage.getItem("username");



	</script>
	


</body>

</html>